var TableScrollEventMixin = function (tableOutClassName) {
  return {
    props: {
      mode: {
        type: String,
        default: 'old'
      }
    },

    data: function () {
      return {
        hasScroll: false,
        timeout: null
      };
    },

    mounted: function () {
      var $el = $(this.$el);
      var $tableDiv = $el.find(`.${tableOutClassName} .el-table .el-table__body-wrapper`);
      var self = this;
      $tableDiv.on('scroll', function (event) {
        if (!self.hasScroll) {
          return;
        }

        var timeout = self.timeout;
        if (timeout !== null) {
          clearTimeout(timeout);
        }

        self.timeout = setTimeout(function () {
          var $target = $(event.target);
          self.$emit('scroll', {
            scrollLeft: $target.scrollLeft(),
            scrollTop: $target.scrollTop()
          }, self.mode);
        }, 50);
      });
      $el.on('mouseover', function () {
        self.hasScroll = true;
      });
      $el.on('mouseout', function () {
        self.hasScroll = false;
      });
    },

    methods: {
      setScroll: function (pos) {
        var $tableDiv = $(this.$el).find('.el-table .el-table__body-wrapper');
        $tableDiv.scrollLeft(pos.scrollLeft);
        $tableDiv.scrollTop(pos.scrollTop);
      }
    }
  };
};
